import utils from "./utils";
export default {
  onDrawn(drawnFn) {
    if (!drawnFn || typeof drawnFn != "function") drawnFn = function() {};
    this.drawnFn = drawnFn;
  },
  onMousedown(opt, canvas) {
    var drawObj = {
      id: new Date().getTime() + "_obj",
    };
    drawObj.isDrawing = true;
    drawObj.drawType = "Line";
    drawObj.pointers = [
      {
        y: opt.absolutePointer.y,
        x: opt.absolutePointer.x,
      },
      {
        y: opt.absolutePointer.y,
        x: opt.absolutePointer.x,
      },
    ];
    this.drawObj = drawObj;
  },
  onMousemove(opt, canvas) {
    if (!this.drawObj || !this.drawObj.isDrawing) return;
    this.drawObj.pointers[1].x = opt.absolutePointer.x;
    this.drawObj.pointers[1].y = opt.absolutePointer.y;

    this.draw(canvas, this.drawObj);
  },
  onMouseup(opt, canvas) {
    this.drawObj.isDrawing = false;
    if (this.drawnFn) this.drawnFn(this.drawObj);
  },
  draw(canvas, drawObj) {
    var zoom = canvas.getZoom();
    var drawOptions ={}
    if (drawObj.fabricObj) {
      //   console.log("drawObj.fabricObj", drawObj.fabricObj);
      drawOptions ={
        x1: drawObj.pointers[0].x,
        y1: drawObj.pointers[0].y,
        x2: drawObj.pointers[1].x,
        y2: drawObj.pointers[1].y,
        strokeWidth: 3 / zoom,
      }
      drawObj.fabricObj.set(utils.combineOptions(drawOptions,drawObj.drawOptions));
      canvas.requestRenderAll();
    } else {
      drawOptions ={
        width: 0,
        height: 0,
        fill: "rgb(0,0,0,0)",
        strokeWidth: 3 / zoom,
        stroke: "rgba(100,200,200,0.8)",
        selectable: false,
      }
      drawObj.fabricObj = new fabric.Line(
        [
          drawObj.pointers[0].x,
          drawObj.pointers[0].y,
          drawObj.pointers[1].x,
          drawObj.pointers[1].y,
        ],
        utils.combineOptions(drawOptions,drawObj.drawOptions)
      );
      canvas.add(drawObj.fabricObj);
    }
    drawOptions=null;

    var rectSize = 6;
    var rectOpt = {
      width: rectSize / zoom,
      height: rectSize / zoom,
      fill: "rgba(100,200,200,0.8)",
      strokeWidth: 0 / zoom,
      selectable: false,
      lockMovementX: true,
      lockMovementY: true,
    };
    var offset = rectSize / 4 / zoom;
    rectOpt.left = drawObj.pointers[0].x - offset;
    rectOpt.top = drawObj.pointers[0].y - offset;

    if (drawObj.lineObjStart) {
      drawObj.lineObjStart.set(rectOpt);
      canvas.requestRenderAll();
    } else {
      drawObj.lineObjStart = new fabric.Rect(rectOpt);
      canvas.add(drawObj.lineObjStart);
    }

    rectOpt.left = drawObj.pointers[1].x - offset;
    rectOpt.top = drawObj.pointers[1].y - offset;

    if (drawObj.lineObjEnd) {
      drawObj.lineObjEnd.set(rectOpt);
      canvas.requestRenderAll();
    } else {
      drawObj.lineObjEnd = new fabric.Rect(rectOpt);
      canvas.add(drawObj.lineObjEnd);
    }
  },
  remove(canvas, drawObj) {
    if (drawObj.fabricObj) canvas.remove(drawObj.fabricObj);
    if (drawObj.lineObjEnd) canvas.remove(drawObj.lineObjEnd);
    if (drawObj.lineObjStart) canvas.remove(drawObj.lineObjStart);
  },
};
